<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jquery.collapsible</title>
<link rel="stylesheet" type="text/css" href="../themes/default/accordion.css" />
<script type="text/javascript" src="../jquery-1.10.2.js">
</script>
<script type="text/javascript" src="../src/jquery.parser.js">
</script>
<script type="text/javascript" src="../src/jquery.accordion.js">
</script>
<style></style>
</head>
<body>
<button onclick="expandAll()">expandAll</button>
<button onclick="collapseAll()">collapseAll</button>
<div class="accordion" data-options="multiple:true">
  <div class="accordion-panel">
    <div class="accordion-header">
    	头
      <div class="accordion-icon accordion-collapse"></div>
    </div>
    <div class="accordion-body">
      内容
    </div>
  </div>
  <div class="accordion-panel">
    <div class="accordion-header">
    	头
      <div class="accordion-icon accordion-collapse"></div>
    </div>
    <div class="accordion-body">
      内容
    </div>
  </div>
  <div class="accordion-panel">
    <div class="accordion-header">
    	头
      <div class="accordion-icon accordion-collapse"></div>
    </div>
    <div class="accordion-body">
      内容
    </div>
  </div>
</div>

<br>

<div class="accordion" data-options="multiple:true">
  <div class="accordion-panel">
    <div class="accordion-header">
    	头
      <div class="accordion-icon accordion-collapse"></div>
    </div>
    <div class="accordion-body">
      内容
    </div>
  </div>
</div>

<br>

<div class="xui-accordion" data-options="initDom:true,multiple:true">
  <div title="标题">
      内容
  </div>
  <div title="标题" style="display:none;">
      内容
  </div>
</div>

<script>
	
	function expandAll() {
		$('.accordion').accordion('expandAll');
	}
	
	function collapseAll() {
		$('.accordion').accordion('collapseAll');
	}
	
	$(function() {
		$('.accordion,.xui-accordion').accordion({
			//multiple: false	
		});
	});
	</script>
</body>
</html>